.hot{
    width: 10.24rem;
    background-color: red;
    margin: 0.1rem auto;
    padding: 0.3rem;

    .title{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    ul{
        overflow: hidden;
        li{
            float: left;
            font-size: 0.14rem;
            text-align: center;
            img{
                width: 100%;
                display: block;
            }
            width: 25%;
            padding: 0.1rem;
        }
    }
}

@media screen and (min-width:640px) and (max-width:1024px){
    .hot{
        background-color: #ffc0cb;
        width: 6.4rem;
        ul{
            li{
                font-size: 0.16rem;
                width: 50%;
            }
        }
    }
}

@media screen and (max-width: 640px) {
    .hot {
      background-color: yellow;
      width: 3.2rem;
      ul {
        li {
          font-size: 0.16rem;
          width: 100%;
        }
      }
    }
  }